// Hooks routers -> useRoutes
import { useRoutes } from "react-router-dom";
import Home from "../pages/Home";
import Login from "../pages/Login";
import NotFount from "../pages/NotFount";
import VisitorList from "../pages/visitors/VisitorList";
import VisitorAdd from "../pages/visitors/VistitorAdd";
import Demo01Router from "../pages/案例/Demo01路由";
import ContextParent from "../pages/案例/Hooks/context/ContextParent";
import DemoHooks from "../pages/案例/Hooks/Hooks";
import UseCallbackParent from "../pages/案例/Hooks/useCallback/UseCallbackParent";
import DemoEffect from "../pages/案例/Hooks/useEffect/useEffect";
import UseMemoParent from "../pages/案例/Hooks/useMemo/UseMemoParent";
import UseRefCurrent from "../pages/案例/Hooks/useRef/useRefCurrent";
import DemoState1 from "../pages/案例/Hooks/useState/保存状态修改状态/UseState";
import DemoLazyIndex from "../pages/案例/异步组件懒加载/Index";
import HomeWork from "../pages/案例作业/Homework";
import TodoListDemo from "../pages/案例作业/todoList/TodoList";
import TodoList from "../pages/案例作业/todoList/TodoList";
// const  DemoLazy  = lazy(() => import('../pages/案例/异步组件懒加载/Demo'))

const Routes = () => {
  return useRoutes([
    {
      path: '/',
      element: <Demo01Router />,
    },
    {
      path: '/demo01Router',
      element: <Demo01Router />,
      children: [
        // {
        //   // path: '', // index属性
        //   index: true,
        //   element: <Home />
        // },
        {
          path: 'home',
          element: <Home />
        },
        {
          path: 'visitorList',
          element: <VisitorList />
        },
        {
          path: 'visitorList/:id/:abc',
          element: <VisitorList />
        },
        {
          path: 'visitorAdd',
          element: <VisitorAdd />
        }
      ]
    },
    {
      path: '/demo02Hook',
      element: <DemoHooks />,
      children: [
        {
          path: 'useState',
          element: <DemoState1 />,
        },
        {
          path: 'useEffect',
          element: <DemoEffect />
        },
        {
          path: 'useRef',
          element: <UseRefCurrent />
        },
        {
          path: 'context',
          element: <ContextParent />
        },
        {
          path: 'useMemo',
          element: <UseMemoParent />
        },
        {
          path: 'useCallback',
          element: <UseCallbackParent />
        },
      ]
    },
    {
      path: '/homework',
      element: <HomeWork />,
      children: [
        {
          // path: '', // index属性
          index: true,
          element: <TodoListDemo />
        },
        {
          path: 'todolist',
          element: <TodoList />
        }
      ]
    },

    {
      path: '/lazyComp',
      element: <DemoLazyIndex />
    },

    {
      path: '/pureFunc',
      element: <DemoLazyIndex />
    },
    {
      path: '/login',
      element: <Login />
    },
    {
      path: '*',
      element: <NotFount />
    }
  ])
}

export default Routes